<template>
  <div :class="[submitConfirmShow ? 'page_body dialog_show' : 'page_body']">
    <div class="home_top">
      <img class="home_top_back" src="../../assets/image/black_icon01.png" alt="返回"
        @click="toBackFn()" />
      <div class="home_top_title">{{ topTitle }}</div>
    </div>
    <div class="referee_register_body">
      <div style="
          width: 100vw;
          display: flex;
          flex-direction: column;
          align-items: center;
        ">
        <div class="referee_register_from_box">
          <!-- 实名认证栏 -->
          <div>
            <div class="referee_register_from_item border_item">
              <div class="border_item_popup_box" style="height: 100%">
                <div class="referee_register_from_upload_img">
                  <div class="border_item_title">
                    <div class="border_item_title_tips">*</div>
                    照片
                  </div>
                  <div class="border_item_popup no_value_item"
                    style="width: 4.8rem; height: 0.94rem; line-height: 0.94rem">
                    请选择大小不超过3M的免冠照
                  </div>
                </div>

                <div class="upload_img_box">
                  <img v-if="userData.photo == null || userData.photo == ''"
                    class="upload_img_box_icon" src="../../assets/image/upload_img_bg03.png" />
                  <img v-if="userData.photo != null && userData.photo != ''"
                    class="upload_img_box_icon" :src="userData.photo" />
                  <input type="file" accept="image/*" ref="uploadImg" id="upload_img_btn"
                    @change="uploadImgBtn($event)" :disabled="!inputKey" />
                </div>
                <img src="../../assets/image/to_icon03.png" class="popup_icon" />
              </div>
            </div>
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                姓名
              </div>
              <input class="referee_register_from_item_input" placeholder="请输入姓名" type="text"
                v-model="userData.name" maxlength="6" :disabled="!inputKey" />
            </div>
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                请选择性别
              </div>
              <div class="border_item_popup_box" @click="openPopup('sex')">
                <div :class="[
                    userData.sex == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]">
                  {{
                    userData.sex == "请选择" ? "请选择您的性别" : userData.sex
                  }}
                </div>
                <img src="../../assets/image/to_icon03.png" class="popup_icon" />
              </div>
            </div>
            <div class="register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                <span>出生日期</span>
              </div>
              <div class="user-detail">
                <!-- 出生日期 -->
                <van-field v-model="timeValue" placeholder="选择的日期结果" @click="showPopFn()"
                  readonly />

                <van-popup v-model="show" position="bottom" :style="{ height: '40%' }">
                  <van-datetime-picker v-model="currentDate" type="date" @change="changeFn()"
                    @confirm="confirmFn()" @cancel="cancelFn()" :min-date="minDate" />
                </van-popup>
              </div>
            </div>
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                证件号
              </div>
              <input class="referee_register_from_item_input" placeholder="请输入您的证件号" type="text"
                v-model="userData.identity_number" maxlength="30" :disabled="!inputKey" />
            </div>

            <div class="referee_register_from_item upload_img_item"
              style="justify-content: space-around; margin-top: 0.4rem">
              <div class="upload_file_box">
                <img v-if="
                    userData.identity_up == null || userData.identity_up == ''
                  " class="upload_file_box_img" src="../../assets/image/identity_up_img01.png" />
                <img v-if="
                    userData.identity_up != null && userData.identity_up != ''
                  " class="upload_file_box_img" :src="userData.identity_up" />

                <input type="file" accept="image/*" ref="identityUp" class="upload_file_box_input"
                  @change="uploadIdentityBtn($event)" :disabled="!inputKey" />
                <div class="upload_file_box_btn">+上传身份证人像面</div>
              </div>
              <div class="upload_file_box">
                <img v-if="
                    userData.identity_down == null ||
                    userData.identity_down == ''
                  " class="upload_file_box_img" src="../../assets/image/identity_down_img01.png" />
                <img v-if="
                    userData.identity_down != null &&
                    userData.identity_down != ''
                  " class="upload_file_box_img" :src="userData.identity_down" />
                <input type="file" accept="image/*" ref="identityDown" class="upload_file_box_input"
                  @change="uploadIdentityDownBtn($event)" :disabled="!inputKey" />
                <div class="upload_file_box_btn">+上传身份证国徽面</div>
              </div>
            </div>
          </div>

          <div class="register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              <span>二级批准日期</span>
            </div>
            <div class="user-detail">
              <!-- 出生日期 -->
              <van-field v-model="twotimeValue" placeholder="选择的日期结果" @click="showPopup()"
                readonly />

              <van-popup v-model="shows" position="bottom" :style="{ height: '40%' }">
                <van-datetime-picker v-model="currentDates" type="date" @change="twochangeFn()"
                  @confirm="twoconfirmFn()" @cancel="twocancelFn()" :min-date="minDate" />
              </van-popup>
            </div>
          </div>
          <div class="referee_register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              所属篮协
            </div>
            <input class="referee_register_from_item_input" type="text" v-model="userData.company"
              maxlength="30" />
          </div>
          <div class="referee_register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              二级证书批准单位
            </div>
            <input class="referee_register_from_item_input" type="text"
              v-model="userData.second_certificate_pass_unit" maxlength="30" />
          </div>
          <div class="referee_register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              报送区篮协(等同机构)或高校
            </div>
            <input class="referee_register_from_item_input" type="text" v-model="userData.pass_unit"
              maxlength="30" />
          </div>

          <!-- 注册信息栏 -->
          <!-- 信息完善 -->
          <div class="referee_register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              服装尺寸
              <div class="form_tips_box" @click="viewSizeListFn()">
                (
                <img class="view_size_icon" src="../../assets/image/wenhao_icon01.png" />
                点击查看尺码表)
              </div>
            </div>
            <div class="border_item_popup_box" @click="openPopup('clothes_size')">
              <div :class="[
                  userData.clothes_size == '请选择'
                    ? 'border_item_popup no_value_item'
                    : 'border_item_popup',
                ]">
                {{
                  userData.clothes_size == "请选择"
                    ? "请选择您的服装尺寸"
                    : userData.clothes_size
                }}
              </div>
              <img src="../../assets/image/to_icon03.png" class="popup_icon" />
            </div>
          </div>

          <div class="referee_register_from_item border_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              鞋码尺寸
            </div>
            <input class="referee_register_from_item_input" placeholder="请输入您的鞋码尺寸" type="number"
              v-model="userData.shoe_size" maxlength="5" />
          </div>
          <div class="referee_register_from_item border_item"
            style="flex-direction: row; justify-content: space-between">
            <div class="border_item_child">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                身高
              </div>
              <div style="display: flex; align-items: center">
                <input class="referee_register_from_item_input" placeholder="请输入您的身高" type="number"
                  v-model="userData.height" maxlength="6" :disabled="!inputKey"
                  style="width: 2.2rem" />
                <div style="color: #333333; font-size: 0.28rem">CM</div>
              </div>
            </div>
            <div class="border_item_child">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                体重
              </div>
              <div style="display: flex; align-items: center">
                <input class="referee_register_from_item_input" placeholder="请输入您的体重" type="number"
                  v-model="userData.weight" maxlength="6" :disabled="!inputKey"
                  style="width: 2.2rem" />
                <div style="color: #333333; font-size: 0.28rem">KG</div>
              </div>
            </div>
          </div>
          <div>
            <div class="form_title">
              <div class="border_item_title_tips">*</div>
              二级证书照片页及等级页
            </div>

            <div class="referee_register_from_item" style="
                height: auto;
                margin-bottom: 0.26rem;
                flex-direction: row;
                justify-content: space-between;
              ">
              <div class="upload_file_box_noBtn">
                <div class="upload_file_box_noBtn_bg" v-if="
                    userData.second_certificate_photo_one == '' ||
                    userData.second_certificate_photo_one == null ||
                    userData.second_certificate_photo_one == undefined
                  ">
                  <img class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png" />
                  <div class="upload_file_box_noBtn_tips">
                    二级证书照片页及等级页
                  </div>
                </div>
                <img class="upload_file_box_noBtn_img" v-else
                  :src="userData.second_certificate_photo_one" />
                <input type="file" accept="image/*" ref="uploadPicFirst"
                  class="upload_file_box_noBtn_input" @change="uploadRefereFirstImgBtn($event)"
                  :disabled="!inputKey" />
              </div>

              <div class="upload_file_box_noBtn">
                <div class="upload_file_box_noBtn_bg" v-if="
                    userData.second_certificate_photo_two == '' ||
                    userData.second_certificate_photo_two == null ||
                    userData.second_certificate_photo_two == undefined
                  ">
                  <img class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png" />
                  <div class="upload_file_box_noBtn_tips">
                    二级证书照片页及等级页
                  </div>
                </div>
                <img class="upload_file_box_noBtn_img" v-else
                  :src="userData.second_certificate_photo_two" />
                <input type="file" accept="image/*" ref="uploadPicSecond"
                  class="upload_file_box_noBtn_input" @change="uploadRefereSecondImgBtn($event)"
                  :disabled="!inputKey" />
              </div>
            </div>
          </div>
          <div class="referee_register_from_send_btn" @click="nextStep()">
            下一步
          </div>
        </div>
      </div>
    </div>

    <!-- 尺码表 -->
    <div class="size_list_body" v-show="sizeListShow">
      <div class="size_list_box">
        <img src="../../assets/image/close_icon02.png" class="size_list_close"
          @click="closeSizeListFn()" />
        <div class="size_list">
          <div class="size_list_title">服装尺码表</div>
          <div class="size_list_item_top">
            <div class="size_list_item_top_val">尺码</div>
            <div class="size_list_item_top_val">身高(cm)</div>
            <div class="size_list_item_top_val">体重(斤)</div>
            <div class="size_list_item_top_val">胸围(cm)</div>
            <div class="size_list_item_top_val">臀围(cm)</div>
          </div>
          <div class="size_list_item" v-for="(item, index) in sizeListData" :key="index">
            <div class="size_list_item_val">{{ item.size }}</div>
            <div class="size_list_item_val">{{ item.height }}</div>
            <div class="size_list_item_val">{{ item.weight }}</div>
            <div class="size_list_item_val">{{ item.bust }}</div>
            <div class="size_list_item_val">{{ item.hipline }}</div>
          </div>
        </div>
      </div>
    </div>

    <!-- 信息提交确认弹窗 -->
    <div class="submit_confirm_body" v-show="submitConfirmShow">
      <div class="submit_confirm_box">
        <div class="submit_confirm_title">确认信息</div>
        <div class="submit_confirm_list">
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">姓名</div>
            <div class="submit_confirm_item_val">{{ userData.name }}</div>
          </div>

          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">性别</div>
            <div class="submit_confirm_item_val">{{ userData.sex }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">出生日期</div>
            <div class="submit_confirm_item_val">{{ timeValue }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">证件号</div>
            <div class="submit_confirm_item_val">
              {{ userData.identity_number }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">批准日期</div>
            <div class="submit_confirm_item_val">{{ twotimeValue }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">批准单位</div>
            <div class="submit_confirm_item_val">
              {{ userData.second_certificate_pass_unit }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">所属篮协</div>
            <div class="submit_confirm_item_val">
              {{ userData.company }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">报送区篮协</div>
            <div class="submit_confirm_item_val">
              {{ userData.pass_unit }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">服装尺寸</div>
            <div class="submit_confirm_item_val">
              {{ userData.clothes_size }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">鞋码尺寸</div>
            <div class="submit_confirm_item_val">{{ userData.shoe_size }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">身高</div>
            <div class="submit_confirm_item_val">{{ userData.height }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">体重</div>
            <div class="submit_confirm_item_val">{{ userData.weight }}</div>
          </div>
        </div>
        <div class="submit_confirm_btn" @click="submitDataFn()">确认</div>
        <div class="submit_confirm_btn_w" @click="editDataFn()">修改</div>
      </div>
    </div>

    <!-- popup选择器 -->
    <mt-popup v-model="popupVisible" position="bottom" @touchmove.native.stop.prevent>
      <div class="popup_body">
        <div class="popup_body_top">
          <div @click="popupCancelFn()" class="popup_body_top_cancel">取消</div>
          <div @click="popupConfirmFn()" class="popup_body_top_confirm">
            确认
          </div>
        </div>
        <mt-picker style="width: 100%" ref="popupPicker" :slots="pickerSlots"
          :visibleItemCount="visibleItemCount" @change="onPickerChange"></mt-picker>
      </div>
    </mt-popup>
  </div>
</template>
<style src="../../assets/css/referee/refereeRegister.css" scoped></style>

<script>
import { MessageBox, Indicator, Toast } from "mint-ui";
// import cityListData from "../../../public/data/cityData.json";
// import nationalityListData from "../../../public/data/nationality.json";

export default {
  name: "RefereeRegister",
  components: {},
  data () {
    return {
      baseAPIUrl: this.$store.state.baseAPIUrl,
      topTitle: "",
      stepKey: 1, // 步骤条值
      userData: {
        name: "", // 姓名
        photo: "", // 照片
        sex: "请选择", // 性别
        identity_number: "", // 证件号
        identity_up: "", // 证件正面
        identity_down: "", // 证件反面
        second_certificate_pass_unit: "", //二级证书批准单位
        pass_unit: "", //报送区篮协(等同机构)或高校
        clothes_size: "请选择", // 服装尺寸
        shoe_size: "", // 鞋码
        height: "", // 身高
        weight: "", // 体重
        company: "", //所属篮协
        second_certificate_photo_one: "", // 二级证书照片页及等级页第一页
        second_certificate_photo_two: "", // 二级证书照片页及等级页第二页
      },

      userCoachId: "", // 学员ID
      uploadUrl: "", // 提交用图片路径Q
      // popup选择相关
      pickerSlots: [], // popup中Slots
      visibleItemCount: 5, // picker备选数
      popupVisible: false, // popup显示
      popupKey: "", // 当前选择器内容

      sexSlots: [
        {
          flex: 1,
          values: ["请选择", "男", "女"],
          textAlign: "center",
        },
      ], // 性别slots
      sexChange: "请选择", // 性别选择

      clothingSizeSlots: [
        {
          flex: 1,
          values: [
            "请选择",
            "男士L",
            "男士XL",
            "男士2XL",
            "男士3XL",
            "男士4XL",
            "女士M",
            "女士L",
            "女士XL",
            "女士2XL",
            "女士3XL",
          ],
          textAlign: "center",
        },
      ], // 服装尺寸slots
      clothingSizeChange: "请选择", // 服装尺寸选择值
      inputKey: true, // 输入控制
      uploadIdentityResponse: {
        idname: "",
        idnumber: "",
        uploadUrl: "",
      },
      sizeListShow: false, // 尺码表显示控制
      sizeListData: [
        {
          size: "男士L",
          height: "160-170",
          weight: "105-125",
          bust: "82-90",
          hipline: "84-92",
        },
        {
          size: "男士XL",
          height: "165-175",
          weight: "125-145",
          bust: "88-96",
          hipline: "90-98",
        },
        {
          size: "男士2XL",
          height: "170-180",
          weight: "145-165",
          bust: "94-102",
          hipline: "96-104",
        },
        {
          size: "男士3XL",
          height: "175-185",
          weight: "165-185",
          bust: "100-108",
          hipline: "102-110",
        },
        {
          size: "男士4XL",
          height: "180-190",
          weight: "185-220",
          bust: "106-114",
          hipline: "108-116",
        },
        {
          size: "女士M",
          height: "160-170",
          weight: "90-110",
          bust: "82-90",
          hipline: "84-92",
        },
        {
          size: "女士L",
          height: "165-175",
          weight: "110-120",
          bust: "88-96",
          hipline: "90-98",
        },
        {
          size: "女士XL",
          height: "170-180",
          weight: "120-130",
          bust: "94-102",
          hipline: "96-104",
        },
        {
          size: "女士2XL",
          height: "175-185",
          weight: "130-140",
          bust: "100-108",
          hipline: "102-110",
        },
        {
          size: "女士3XL",
          height: "180-190",
          weight: "140-160",
          bust: "106-114",
          hipline: "108-116",
        },
      ], // 尺码表数据

      submitConfirmShow: false, // 信息确认弹窗显示

      uploadTipsShow: false, // 裁判员证件上传说明显示
      isOther: 0, // 是否代替注册 0. 否;1. 是
      currentDate: new Date(),
      changeDate: new Date(),
      currentDates: new Date(),
      changeDates: new Date(),
      minDate: new Date(1970, 0, 1),
      timeValue: "",
      twotimeValue: "", //二级批准日期（年月日）
      show: false,
      shows: false,
    };
  },
  created: function () {
    let query = this.$route.query;
    if (query.isother != undefined && query.isother != "") {
      this.isOther = query.isother;
    }
    this.getDetailDataFn();
  },
  methods: {
    //出生日期
    showPopFn () {
      this.show = true;
    },
    changeFn () {
      // 值变化是触发
      this.changeDate = this.currentDate; // Tue Sep 08 2020 00:00:00 GMT+0800 (中国标准时间)
      console.log(this.changeDate);
    },
    confirmFn () {
      // 确定按钮
      this.timeValue = this.timeFormat(this.currentDate);
      console.log(this.timeValue, this.twotimeValue);

      this.show = false;
    },
    cancelFn () {
      this.show = true;
    },
    timeFormat (time) {
      // 时间格式化 2019-09-08
      let year = time.getFullYear();
      let month = time.getMonth() + 1;
      let day = time.getDate();
      if (month >= 1 && month <= 9) {
        month = ("0" + month).toString();
      }
      if (day >= 1 && day <= 9) {
        day = ("0" + day).toString();
      }
      // this.timevalue = year + month + day;
      // console.log(this.timevalue);
      return year + "-" + month + "-" + day;
    },

    //二级批准日期
    showPopup () {
      this.shows = true;
    },
    twochangeFn () {
      // 值变化是触发
      this.changeDates = this.currentDates; // Tue Sep 08 2020 00:00:00 GMT+0800 (中国标准时间)
      console.log(this.changeDates);
    },
    twoconfirmFn () {
      // 确定按钮
      this.twotimeValue = this.twotimeFormat(this.currentDates);
      this.shows = false;
    },
    twocancelFn () {
      this.shows = true;
    },
    twotimeFormat (time) {
      // 时间格式化 2019-09-08
      let year = time.getFullYear();
      let month = time.getMonth() + 1;
      let day = time.getDate();
      if (month >= 1 && month <= 9) {
        month = ("0" + month).toString();
      }
      if (day >= 1 && day <= 9) {
        day = ("0" + day).toString();
      }
      // this.timevalue = year + month + day;
      // console.log(this.timevalue);
      return year + "-" + month + "-" + day;
    },

    // 打开popup选择
    openPopup: function (key) {
      let that = this;
      if (this.inputKey) {
        this.popupKey = key;
        // this.valueKey = "";
        this.popupVisible = true;

        if (key == "clothes_size") {
          this.pickerSlots = this.clothingSizeSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.clothes_size);
        }

        if (key == "sex") {
          this.pickerSlots = this.sexSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.sex);
        }
      }
    },

    // picker选择
    onPickerChange: function (picker, values) {
      if (this.popupKey == "identityType") {
        if (values[0]) {
          if (values[0] == "") {
            this.identityTypeChange = "请选择";
          } else {
            this.identityTypeChange = values[0];
          }
        }
      }

      if (this.popupKey == "clothes_size") {
        if (values[0]) {
          if (values[0] == "") {
            this.clothingSizeChange = "请选择";
          } else {
            this.clothingSizeChange = values[0];
          }
        }
      }

      if (this.popupKey == "sex") {
        if (values[0]) {
          if (values[0] == "") {
            this.sexChange = "请选择";
          } else {
            this.sexChange = values[0];
          }
        }
      }
    },

    // popup弹窗取消
    popupCancelFn: function () {
      let key = this.popupKey;
      this.politicalChange = this.userData.political_status;
      //   }
      if (key == "clothes_size") {
        this.clothingSizeChange = this.userData.clothes_size;
      }

      if (key == "sex") {
        this.sexChange = this.userData.sex;
      }

      this.popupVisible = false;
      this.popupObjVisible = false;
    },

    // popup弹窗确认
    popupConfirmFn: function () {
      let key = this.popupKey;

      if (key == "clothes_size") {
        this.userData.clothes_size = this.clothingSizeChange;
      }

      if (key == "sex") {
        this.userData.sex = this.sexChange;
      }

      this.popupVisible = false;
      this.popupObjVisible = false;
    },

    // 提交信息
    submitDataFn: function () {
      let that = this;
      let url = "/mobile/completEnrollReferee";
      let levelValue = 0;

      let data = {
        name: this.userData.name, // 姓名
        photo: this.userData.photo, // 照片
        sex: this.userData.sex, // 性别
        identity_number: this.userData.identity_number, // 证件号
        identity_up: this.userData.identity_up, // 证件正面
        identity_down: this.userData.identity_down, // 证件反面
        second_certificate_pass_unit:
          this.userData.second_certificate_pass_unit, //二级证书批准单位
        pass_unit: this.userData.pass_unit, //报送区篮协(等同机构)或高校
        birth: this.timeValue, //出生日期
        second_certificate_pass_date: this.twotimeValue, //批准日期
        clothes_size: this.userData.clothes_size, // 服装尺寸
        shoe_size: this.userData.shoe_size, // 鞋码
        height: this.userData.height, // 身高
        weight: this.userData.weight, // 体重

        second_certificate_photo_one:
          this.userData.second_certificate_photo_one, // 裁判员证件第一页
        second_certificate_photo_two:
          this.userData.second_certificate_photo_two, // 裁判员证件第二页
        company: this.userData.company, //所属篮协
      };
      // if (this.userCoachId != "" && this.isOther == 0) {
      //   data.coach_id = this.userCoachId;
      // }

      MessageBox.confirm("确认提交?").then(() => {
        Indicator.open();
        that.axios
          .post(url, data)
          .then((response) => {
            Indicator.close();
            if (response.code == 0) {
              // that.$store.commit("set_isRegister", 2);
              // sessionStorage.removeItem("REFEREEREGISTEROBJ");
              // if (levelValue == 1 || levelValue == 2) {
              //   Toast({
              //     message: "完善成功",
              //     duration: 3000,
              //   });
              // 跳转首页
              if (this.$route.query.title == "裁判员分享出去") {
                that.$router.replace({
                  name: "enrollsthree",
                  query: {
                    enrollId: this.$route.query.enrollId,
                  },
                });
              } else {
                that.$router.replace({
                  name: "RefereeEnrollDetail",
                  query: {
                    enrollId: this.$route.query.enrollId,
                  },
                });
              }
            } else {
              Toast({
                message: response.msg,
                duration: 3000,
              });
            }
          })
          .catch(function (error) {
            Indicator.close();
            console.log(error);
          });
      });
    },

    // 获取用户信息
    getDetailDataFn: function () {
      let that = this;
      let url = "/mobile/getUserInfo";
      let data = {};
      Indicator.open();
      this.axios
        .post(url, data)
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            that.userCoachId = response.info.id;
            that.userData.name = response.info.name;
            that.userData.photo = response.info.photo;
            that.userData.sex = response.info.sex;
            that.userData.identity_number = response.info.identity_number;
            // that.userData.identity_up = response.info.identity_up;
            // that.userData.identity_down = response.info.identity_down;
            that.userData.second_certificate_pass_unit =
              response.info.second_certificate_pass_unit;

            that.userData.pass_unit = response.info.pass_unit;
            that.userData.clothes_size = response.info.clothes_size;
            that.userData.shoe_size = response.info.shoe_size;
            that.userData.height = response.info.height;
            that.userData.weight = response.info.weight;

            that.userData.second_certificate_photo_one =
              response.info.second_certificate_photo_one;

            that.userData.second_certificate_photo_two =
              response.info.second_certificate_photo_two;
            that.timeValue = response.info.birth;
            that.twotimeValue = response.info.second_certificate_pass_date;
            that.userData.company = response.info.company;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传头像图片
    uploadImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadImg.value = "";
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            let image = new Image();
            image.onload = function () {
              // let width = image.width;
              // let height = image.height;
              // let cl = height / width;
              // if (cl >= 1.28 && cl <= 1.52) {
              that.uploadImgFn(res.target.result);
              // } else {
              //   that.$refs.uploadImg.value = "";
              //   Toast({
              //     message: "照片尺寸不合规",
              //     duration: 3000,
              //   });
              // }
            };
            image.src = res.target.result;
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传图片到服务器
    uploadImgFn: function (imgData) {
      let that = this;
      let url = "/upload/uploadPhoto";
      let data = {
        source: 1,
        file: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            if (response.is_face == 1) {
              let path = response.image;
              that.uploadUrl = response.image;
              that.userData.photo = path;
            } else {
              console.log(response.msg);
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传身份证正面
    uploadIdentityBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        that.$refs.identityUp.value = "";
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            that.uploadIdentityFn(res.target.result, 1);
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传身份证背面
    uploadIdentityDownBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        that.$refs.identityDown.value = "";
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            that.uploadIdentityFn(res.target.result, 2);
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传身份证到服务器
    uploadIdentityFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadCardup";
      let uploadType = type;
      let data = {
        type: uploadType,
        file: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image;
            if (uploadType == 1) {
              that.uploadIdentityResponse.uploadUrl = response.image;
              that.uploadIdentityResponse.idname = response.idname;
              that.uploadIdentityResponse.idnumber = response.idnumber;
              console.log(
                that.uploadIdentityResponse.idname,
                that.uploadIdentityResponse.idnumber
              );
              that.userData.identity_up = path;
            } else {
              that.userData.identity_down = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 下一步
    nextStep: function () {
      if (

        this.userData.company == ""
      ) {
        console.log(this.userData.second_certificate_photo_one);
        Toast({
          message: "请先完善身份信息",
        });
        return false;
      } else {
        // 验证身份正则
        let idNumberText =
          /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$)/;
        if (!idNumberText.test(this.userData.identity_number)) {
          Toast({
            message: "身份证格式不正确",
          });
          return false;
        } else {
          if (
            this.userData.identity_number !=
            this.uploadIdentityResponse.idnumber ||
            this.userData.name != this.uploadIdentityResponse.idname
          ) {
            Toast({
              message: "身份信息与上传照片信息不符",
            });
            return false;
          }
        }
      }
      // console.log(this.userData.company);
      this.submitConfirmShow = true;
    },

    // 上传裁判员证件第一页
    uploadRefereFirstImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadPicFirst.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadRefereFn(res.target.result, 1);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传裁判员证件第二页
    uploadRefereSecondImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadPicSecond.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadRefereFn(res.target.result, 2);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传裁判员证件到服务器
    uploadRefereFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadImage";
      let uploadType = type;
      let data = {
        source: 8,
        img: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image_path;
            if (uploadType == 1) {
              that.userData.second_certificate_photo_one = path;
            } else if (uploadType == 2) {
              that.userData.second_certificate_photo_two = path;
            } else {
              that.userData.pic_third = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 查看尺码表
    viewSizeListFn: function () {
      this.sizeListShow = true;
    },

    // 关闭查看尺码表
    closeSizeListFn: function () {
      this.sizeListShow = false;
    },

    // 返回
    toBackFn: function () {
      this.$router.go(-1);
      //   if (this.stepKey == 1) {

      //   } else {
      //     // this.stepKey = this.stepKey - 1;
      //     this.inputKey = true;
      //   }
    },

    // 修改填写
    editDataFn: function () {
      this.submitConfirmShow = false;
    },

    // 选择性别
    checkSexFn: function (val) {
      if (this.inputKey) {
        this.userData.sex = val;
      }
    },
  },
  watch: {
    userData: {
      handler (newval) {
        sessionStorage.setItem("REFEREEREGISTEROBJ", JSON.stringify(newval));
      },
      deep: true,
    },
  },
};
</script>
